<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
<head>
    <title th:text="${examRecord['name']}"></title>
    <div data-th-replace="layout/head"></div>

    <link rel="stylesheet" th:href="@{{path}/front/mobile/v3/wmui/0.6.2/css/wm-extend.min.css?v={v}(path=${staticPath},v=${v})}">
</head>
<body>
    <input type="hidden" id="examRecordId" th:value="${examRecord['id']}"/>
    <input type="hidden" id="examId" th:value="${examRecord['examId']}"/>
    <input type="hidden" id="examTime" th:value="${examRecord['examTime']}"/>
    <input type="hidden" id="answerTime" th:value="${examRecord['answerTime']}"/>
    <input type="hidden" id="mode" th:value="${examRecord['mode']}"/>
    <input type="hidden" id="marking" th:value="${examRecord['marking']}"/>
    <input type="hidden" id="marked" th:value="${examRecord['marked']}"/>
    <input type="hidden" id="status" th:value="${examRecord['status']}"/>
    <input type="hidden" id="type" th:value="${examRecord['type']}"/>
    <header class="bar bar-nav">
        <a class="button button-link button-nav pull-left goBack" th:href="@{/mobile/uc/operation/operationResult?taskId={examRecordId}(examRecordId=${examRecord['id']})}">
            <span class="iconfont icon-fanhui"></span>
        </a>
        <th:block th:if="${examRecord['status']}==1">
            <!-- 练习模式才会显示 -->
            <a th:if="${examRecord['mode']}==2" class="button button-link button-nav pull-right" href="javascript:void(0);">
                <span class="c-bbb icon icon-settings"></span>
            </a>

            <h1 class="title" th:if="${examRecord['useType']}!=2">考试中</h1>
            <h1 class="title" th:if="${examRecord['useType']}==2">做作业</h1>
        </th:block>
        <h1 class="title" th:if="${examRecord['status']}==2">试题解析</h1>
    </header>
    <nav class="bar bar-tab course-info-bar-tab exam-r-bar-tab">
        <a class="tab-item external" id="AnswerCard-btn" href="javascript:void(0);">
            <em class="icon iconfont icon-datiqia_icon vam" style="font-size: .75rem;"></em><span class="vam tab-label">答题卡</span>
        </a>
        <th:block th:if="${examRecord['status']}==1">
            <a class="tab-item external" id="pause_exam" href="javascript:void(0)">
                <em class="icon icon-clock vam" style="font-size: .75rem;"></em>
                <b class="vam tab-label" id="current-exam-time">[ 00:00:00 ]</b>
            </a>
            <a class="tab-item external cInfo-price-bx" id="finish_exam" href="javascript:void(0)">
                <span class="pl5 pr5 fs7"> 我要交卷 </span>
            </a>
        </th:block>
        <th:block th:if="${examRecord['status']}==2">
            <a class="tab-item external error-correction" href="javascript:void(0);">
                <em style="font-size: .75rem;" class="icon iconfont icon-tanhao vam"></em><span class="vam tab-label">纠错</span>
            </a>
            <a th:if="${examRecord['marking']}==1 or (${examRecord['marking']}==2 and ${examRecord['marked']}==2)" class="tab-item external cInfo-price-bx" th:href="@{/mobile/uc/operation/operationResult?taskId={taskId}(taskId=${examRecord['id']})}">
                <span class="pl5 pr5 fs7"> 练习报告 </span>
            </a>
            <a th:if="${examRecord['marking']}==2 and ${examRecord['marked']}==1" class="tab-item external cInfo-price-bx" id="finish-mark-exam" href="javascript:void(0);">
                <span class="pl5 pr5 fs7"> 完成自评 </span>
            </a>
        </th:block>
    </nav>

    <article class="content wm-content ovf order-content">
        <section class="wm-buttons-tab__wrap">
            <section class="card-header">
                <span id="exam-active-type">试题类型</span>
                <span class="fs7">
                    <big>
                        <strong class="c-blue" id="exam-active-number">1</strong>
                    </big>
                    <big th:text="'/ '+${examRecord['questionCount']}"></big>
                </span>
            </section>
        </section>
        <!-- 试题内容，开始 -->
        <div class="content examination__wrap courses-list-page__wrap ovf">
            <div class="swiper-container" data-space-between="10">
                <div class="swiper-wrapper" id="question-list-box">
                    <!-- 试题内容 -->
                </div>
            </div>
        </div>
        <!-- 试题内容，结束 -->
    </article>

    <div class="popup popup-about AnswerCard-Popup cArticleMenuPopup">
        <header class="bar bar-nav">
            <button class="button button-link button-nav pull-right close-popup">
                <span class="iconfont icon-guanbi mr5"></span></button>
            <h1 class="title pl5" style="text-align: left">
                答题卡 <small class="fs4 c-bbb" th:text="'（共 '+${examRecord['questionCount']}+' 道）'">（共 0 道）</small>
            </h1>
        </header>
        <div class="content">
            <div class="content-padded" id="AnswerCard-popup-num-list">
                <!-- 答题卡内容 -->
            </div>
        </div>
    </div>

    <textarea id="examination-stop-ele" class="hide">
        <div class="text-center pr pt5 pb5">
            <aside class="exam-stop-icon"><span>&nbsp;</span></aside>
            <h3 class="pt5" style="margin-bottom: 0;font-weight: 200;">暂停中</h3>
            <span class="fs7 c-bbb">当前答题用时</span>
            <span class="fs7 c-blue">00:00:00</span>
        </div>
    </textarea>
    <div data-th-replace="layout/footer"></div>
    <!--引导页面-->
    <div class="modal-overlay modal-overlay-visible exam-guide hide">
        <div class="ex-hint-wrap"> </div>
    </div>
    <!--引入滑动库-->
    <script th:src="@{{path}/front/mobile/libs/swiper/swiper.min.js?v={v}(path=${staticPath},v=${v})}" charset="utf-8"></script>
    <script th:src="@{{path}/front/mobile/business/exam/common/exam.js?v={v}(path=${staticPath},v=${v})}" charset="utf-8"></script>
    <script th:src="@{{path}/front/mobile/business/exam/record/get-user-answer.js?v={v}(path=${staticPath},v=${v})}" charset="utf-8"></script>
    <script th:src="@{{path}/front/mobile/business/exam/record/start-examination.js?v={v}(path=${staticPath},v=${v})}" charset="utf-8"></script>
    <script th:src="@{{path}/front/mobile/business/exam/record/load-exam-data.js?v={v}(path=${staticPath},v=${v})}" charset="utf-8"></script>
    <script th:inline="javascript">
        var questionIndex = [[${questionIndex}]];
        var examStatus = [[${examRecord['status']}]];
    </script>
</body>
</html>